{extend name="public/base"}

{block name="title"}
钱包
{/block}

{block name="style"}
{css href="/static/wechat/css/wallet.css" /}
{/block}

{block name="body"}
<div class="pageControl withdraw">
    <div class="msui_nav msui_navTop">
        <a class="msui_navTop-back" href="javascript:history.back();"><i class="micon-back"></i></a>
        <h1 class="msui_navTop-title">提现</h1>
    </div>
    {eq name="data.member.is_certification" value="2"}
    <form action="?" method="post" id="withdraw_form">
        <input type="hidden" name="phone" value="{$data.member.phone}">
        <input type="hidden" name="type" value="{$type}">
        <input type="hidden" name="account" value="">
        <input type="hidden" name="fund_account_id" value="">
        <input type="hidden" name="fund_account_type" value="">
        <div class="weui-cells weui-cells_form js-form">
            <a class="weui-cell open-popup" href="javascript:;" data-target="#chooseBank">
                <div class="weui-cell__hd"><label class="weui-label">提现到账户</label></div>
                <div class="weui-cell__bd bank">
                    {empty name="data.fund_account"}
                    <p style="position: relative; top: 50%; ">未绑定银行卡</p>
                    {else /}
                    <p style="position: relative; top: 50%; ">请选择银行卡</p>
                    {/empty}
                    <!--<input class="weui-input fs08 cl-3333 input-bank" type="text" readonly="readonly" placeholder="xxx银行">-->
                    <!--<input class="weui-input fs075 cl-9999 input-number" type="text" readonly="readonly" placeholder="xxxx1232">-->
                </div>
                <div class="weui-cell__ft">
                    <i class="micon-in bc-9999"></i>
                </div>
            </a>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label fs085">金额(元)</label></div>
                <div class="weui-cell__bd">
                    <input class="weui-input fs075" type="number" name="money" placeholder="{$data.member.money}">
                </div>
                <div class="weui-cell__ft">
                    <span class="fs08 cl-9999">手续费:￥<span class="withdraw_poundage">0</span></span>
                    <input type="hidden" name="withdraw_poundage">
                </div>
            </div>
            <p class="error_text"></p>
        </div>
        <div class="msui_button">
            <div class="msui_button-hd">
                <p class="cl-3333 fs075">每次提现金额必须大于50元</p>
            </div>
            {php} if(count($data['fund_account']) > 0 && $data['member']['money'] >= 50) {{/php}
            <div class="msui_button-bd">
                <a href="javascript:;" class="msui_button-content next background{$type}">下一步</a>
            </div>
            {php}} else {{/php}
            <div class="msui_button-bd">
                <a href="javascript:;" class="msui_button-content" style="background: #6C7479;">下一步</a>
            </div>
            {php}}{/php}
        </div>
        <div class="withdraw_next" style="z-index: 1; position: absolute; top: 0; bottom: 0; left: 100%; width: 100vw; background: #fff; display: none;">
            <div class="msui_nav msui_navTop">
                <a class="msui_navTop-back withdraw_back" href="javascript:;"><i class="micon-back"></i></a>
                <h1 class="msui_navTop-title">短信验证</h1>
            </div>
            <div class="weui-msg">
                <div class="weui-msg__text-area">
                    <h2 class="weui-msg__title">提现需要验证您的身份</h2>
                    <p class="weui-msg__desc">验证码将发送至：{php} echo substr($data['member']['phone'], 0, 3) . '****' . substr($data['member']['phone'], -4);{/php}</p>
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">验证码</label></div>
                <div class="weui-cell__bd">
                    <input class="weui-input" type="number" name="code" placeholder="请输入验证码">
                </div>
                <div class="weui-cell_ft">
                    <button class="weui_cell-verify js-verify cl-orange" >获取验证码</button>
                </div>
            </div>
            <div class="msui_button">
                {php} if(count($data['fund_account']) > 0 && $data['member']['money'] >= 50) {{/php}
                <div class="msui_button-bd">
                    <a href="javascript:;" class="msui_button-content send background{$type}">提 交</a>
                </div>
                {php}} else {{/php}
                <div class="msui_button-bd">
                    <a href="javascript:;" class="msui_button-content" style="background: #6C7479;">确认提交</a>
                </div>
                {php}}{/php}
            </div>
        </div>
    </form>
    {else /}
    <div class="msui_button">
        <div class="msui_button-hd">
            <p>完成实名认证后，才能提现</p>
        </div>
        <div class="msui_button-bd">
            <a class="msui_button-content background{$type}" href="{:url('w_member_role_info/certification', ['type' => $type])}">提交实名认证资料</a>
        </div>
    </div>
    {/eq}
    <!--银行卡选择弹出层开始-->
    <div id="chooseBank" class="weui-popup__container js-chooseBank ">
        <div class="weui-popup__overlay"></div>
        <div class="weui-popup__modal">
            <div class="msui_nav msui_navTop">
                <a class="msui_navTop-back close-popup"><i class="micon-back"></i></a>
                <h1 class="msui_navTop-title">选择银行卡</h1>
                <a class="msui_navTop-icon" href="{:url('save_bank', ['type' => $type, 'url' => 3])}"><i class="micon-add"></i></a>
            </div>
            <div class="weui-cells js-bank">
                {empty name="data.fund_account"}
                    <p style="margin: 2rem 0; text-align: center;">未绑定银行卡！！</p>
                {else /}
                    {volist name="data.fund_account" id="vo"}
                    <div class="msui_table msui_tableCom bank_list" data-fund-account-id="{$vo.id}" data-fund-account-type="{$vo.type}">
                        <div class="msui_tabCell-img msui_tableImg-circle">
                            <img src="{$vo.logo|get_img_url}">
                        </div>
                        <div class="msui_tabCell-content">
                            <p class="fs085 cl-3333 js-bank" data-bank-name="{$vo.bank_name}">{$vo.bank_name}</p>
                            <p class="fs085 cl-9999 js-number" data-bank-account="{$vo.account}">卡号:<span>{php}echo str_repeat(str_repeat('*', 4) . ' ', 3) . substr($vo['account'], -4);{/php}</span></p>
                        </div>
                        <div class="msui_tabCell-button">
                            <i></i>
                        </div>
                    </div>
                    {/volist}
                {/empty}
            </div>
        </div>
    </div>
</div>
<!-- loading toast -->
<div id="loadingToast" style="display:none;">
    <div class="weui-mask_transparent"></div>
    <div class="weui-toast" style="opacity: 1; visibility: visible;">
        <i class="weui-loading weui-icon_toast"></i>
        <p class="weui-toast__content">正在加载</p>
    </div>
</div>
{/block}

{block name="javascript"}
<script>
    $(function () {
        $('input[name="money"]').bind('input propertychange', function() {
            var _this = $(this);
            var money = _this.val();
            var member_money = {$data.member.money};
            if (money > member_money) {
                $(".error_text").show().text('余额不足').css({
                    'background': '#fff',
                    'border-top': '1px solid #ECECEC',
                    'color': 'red',
                    'padding': '5px 12px'
                });
                return false;
            } else {
                $(".error_text").hide();
            }
        });

        $(".bank_list").click(function () {
            var _this = $(this);
            var bank_name = _this.find('.js-bank').data("bank-name");
            var account = _this.find('.js-number').data("bank-account");
            var fund_account_id = _this.data("fund-account-id");
            var fund_account_type = _this.data("fund-account-type");
            var html = '<input class="weui-input fs08 cl-3333 input-bank" type="text" readonly="readonly" value="'+bank_name+'" placeholder="'+bank_name+'">' +
                    '<input class="weui-input fs08 cl-3333 input-number" type="text" readonly="readonly" value="'+_this.find('.js-number').find('span').text()+'" placeholder="'+_this.find('.js-number').find('span').text()+'">';

            $('input[name="fund_account_id"]').val(fund_account_id);
            $('input[name="fund_account_type"]').val(fund_account_type);
            $('input[name="account"]').val(account);
            $(".bank").html(html);
            $(".close-popup").click();
        });

        // 计算手续费
        $('input[name="money"]').blur(function () {
            $('#loadingToast').fadeIn(100);
            var _money = $(this).val();
            var _type = '{$type}';
            $.get("{:url('base/get_withdraw_poundage')}", {money : _money, type : _type}, function (msg) {
                $('#loadingToast').fadeOut(100);
                if (msg.code == 200) {
                    $(".withdraw_poundage").text(msg.data);
                    $("input[name='withdraw_poundage']").val(msg.data);
                } else {
                    alert('系统繁忙！！');
                }
            }, 'json');
        });

        // 点击下一步
        $(".next").click(function () {
            var money = $('input[name="money"]').val();
            if (money < 50) {
                $.alert('提现金额不能低于50元');
                return false;
            }
            if (!$("input[name='account']").val()) {
                $.alert('请选择银行卡');
                return false;
            }
            $(".withdraw_next").show().animate({
                left: "0"
            });
        });

        // 返回上一步
        $(".withdraw_back").click(function () {
            $(".withdraw_next").animate({
                left: "100%"
            }, function () {
                $(".withdraw_next").hide();
            });
        });

        // 提交提现申请
        $(".send").click(function () {
            var money = $('input[name="money"]').val();
            if (money < 50) {
                $.alert('提现金额不能低于50元');
                return false;
            }
            if (!$("input[name='account']").val()) {
                $.alert('请选择银行卡');
                return false;
            }
            $('#loadingToast').fadeIn(100);
            var _obj = $("#withdraw_form");
            $.ajax({
                type : 'POST',
                url : _obj.attr('action'),
                data : _obj.serialize(),
                dataType : 'json',
                success : function (msg) {
                    $('#loadingToast').fadeOut(100);
                    console.log(msg);
                    if (msg.code == 200) {
                        alert('提交成功！！');
                        window.location.reload();
                    } else {
                        var code = msg.code;
                        $.alert(error_code[code]);
                    }
                }
            });
        });
    });

</script>
{/block}